<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>首页</title>
    <!-- 网页logo -->
    <link rel="shortcut icon" href="./img/logo.jpg">
    <link rel="stylesheet" href="./css/miindex.css">
    <link rel="stylesheet" href="../css/common.css">
    <link rel="stylesheet" href="./layui/css/layui.css">
    <link rel="stylesheet" href="./iconfont/iconfont.css">

</head>

<body>
    <!-- 头部开始 -->
    <div class="header">
        <div class="content">
            <div class="header_nav">
                <!-- 第一个列表开始 -->
                <ul class="ul1">
                    <li class="li1"><a href="#">小米商城<span>|</span></a></li>
                    <li><a href="#">MIUI<span>|</span></a></li>
                    <li><a href="#">Lot<span>|</span></a></li>
                    <li><a href="#">云服务<span>|</span></a></li>
                    <li><a href="#">天星数科<span>|</span></a></li>
                    <li><a href="#">有品<span>|</span></a></li>
                    <li><a href="#">小爱开放平台<span>|</span></a></li>
                    <li><a href="#">企业团购<span>|</span></a></li>
                    <li><a href="#">资质证照<span>|</span></a></li>
                    <li><a href="#">协议规则<span>|</span></a></li>
                    <li class="special"><a href="#">下载app<span>|</span></a>
                        <div class="code"><img src="./img/小米二维码.jpg">
                            <span style="font-size:28px">小米商城APP</span>
                        </div>
                        <div class="tri"></div>
                    </li>
                    <li><a href="#">SelectLocation</a>
                    </li>
                </ul>
                <!-- 第二个列表 -->
                <ul class="ul2" style="margin-left: 70px;">
                    <li class="li_user">wq
                        <!-- <div class="user_info">
                <p>个人中心</p>
                <p>评价晒单</p>
                <p>我的喜欢</p>
                <p>小米账户</p>
                <p>退出登录</p>
               </div> -->
                    </li>
                    <li class="exit"><span>|</span><a href="">退出登录</a></li>
                    <li class="login"><a href="login.html">登录<span>|</span></a></li>
                    <li class="regist"><a href="regist.html">注册</a></li>
                    <li class="news"><span>|</span><a href="#">消息通知</a></li>
                    <li class="order"><span>|</span><a href="#">我的订单</a></li>
                </ul>
                <!-- 第三个  购物车 -->
                <div class="cart">
                    <span class="iconfont">&#xe631;</span>
                    <span class="iconcart">购物车(0)
                        <div class="cart_bottom">
                            <span>别看了，这里啥也没有。</span>
                        </div>
                    </span>
                </div>
            </div>
        </div>
    </div>

    <!-- 导航开始 -->

    <div class="nav">
        <div class="content">
            <!-- logo开始 -->
            <img src="./img/logo.jpg" alt="">
            <!-- 导航的列表开始 -->
            <ul class="nav_ul">
                <li class="nav_li1 nb">
                    <a href="#">疯狂抢购</a>
                    <div class="nav_son">
                    </div>
                </li>
                </li>
                <li class="nav_li2 nb">
                    <a href="#">热卖中</a>
                    <div class="nav_son">

                    </div>
                </li>
                <li class="nav_li3 nb">

                    <a href="#">推荐商品</a>
                    <div class="nav_son">
                        <div class="nav_grandson">
                            <img src="./img/手机1.webp" alt="">
                            <div class="title">小米12</div>
                            <p class="price">4399起</p>
                        </div>

                    </div>
                </li>
                <li class="nav_li4 nb">

                    <a href="#">新品推荐</a>
                    <a class="nav_son">
                        <div class="nav_grandson">
                            <img src="./img/笔记本1.webp" alt="">
                            <div class="title">小米12</div>
                            <p class="price">4399起</p>
                        </div>
                    </a>

                </li>
                <li class="nav_li5 nb">
                    <a href="#">猜你喜欢
                        <div class="nav_son">
                            <div class="nav_grandson">
                                <img src="./img/手机1.webp" alt="">
                                <div class="title">小米12</div>
                                <p class="price">4399起</p>
                            </div>
                        </div>
                    </a>

                </li>
            </ul>
            <!-- 导航栏 input开始 -->
            <div class="sousuo">
                <input type="text" placeholder="&ensp;小爱同学">
                <button class="iconfont">&#xe651;</button>
            </div>
        </div>
    </div>
    <!-- 轮播图banner开始 -->
    <div class="banner">
        <div class="content banner_content">
            <!-- 左侧导航 -->
            <div class="banner_nav">
                <ul>

                    <li><a href="#">手机<span>></span></a>
                        <div class="column">
                            <div class="menu">
                                <img src="./img/小图标1.webp" alt="">
                                <div class="text">Note 11T Pro+</div>
                            </div>
                            <div class="menu">
                                <img src="./img/小图标1.webp" alt="">
                                <div class="text">Note 11T Pro+</div>
                            </div>

                        </div>
                    </li>

                    <li><a href="#">电视<span>></span></a>
                        <div class="column">

                            <div class="menu">
                                <img src="./img/小图标1.webp" alt="">
                                <div class="text">Note 11T Pro+</div>
                            </div>
                            <div class="menu">
                                <img src="./img/小图标1.webp" alt="">
                                <div class="text">Note 11T Pro+</div>
                            </div>
                        </div>
                    </li>

                    <li><a href="#">笔记本&ensp;平板<span>></span></a>
                        <div class="column">
                            <div class="menu">
                                <img src="./img/平板1.webp" alt="">
                                <div class="text">Note 11T Pro+</div>
                            </div>
                            <div class="menu">
                                <img src="./img/笔记本1.webp" alt="">
                                <div class="text">Note 11T Pro+</div>
                            </div>

                            <div class="menu">
                                <img src="./img/平板1.webp" alt="">
                                <div class="text">Note 11T Pro+</div>
                            </div>

                    </li>

                    <li><a href="#">出行&ensp;穿戴<span>></span></a>
                        <div class="column">
                            <div class="menu">
                                <img src="./img/小图标1.webp" alt="">
                                <div class="text">Note 11T Pro+</div>
                            </div>
                            <div class="menu">
                                <img src="./img/小图标1.webp" alt="">
                                <div class="text">Note 11T Pro+</div>
                            </div>



                        </div>
                    </li>

                    <li><a href="#">耳机&ensp;音响<span>></span></a>
                        <div class="column">
                            <div class="menu">
                                <img src="./img/小图标1.webp" alt="">
                                <div class="text">Note 11T Pro+</div>
                            </div>
                            <div class="menu">
                                <img src="./img/小图标1.webp" alt="">
                                <div class="text">Note 11T Pro+</div>
                            </div>

                        </div>
                    </li>
                    <li><a href="#">家电<span>></span></a>

                        <div class="column">
                            <div class="menu">
                                <img src="./img/小图标1.webp" alt="">
                                <div class="text">Note 11T Pro+</div>
                            </div>
                            <div class="menu">
                                <img src="./img/小图标1.webp" alt="">
                                <div class="text">Note 11T Pro+</div>
                            </div>

                        </div>
                    </li>

                    <li><a href="#">智能&ensp;路由器<span>></span></a>
                        <div class="column">
                            <div class="menu">
                                <img src="./img/小图标1.webp" alt="">
                                <div class="text">Note 11T Pro+</div>
                            </div>
                            <div class="menu">
                                <img src="./img/小图标1.webp" alt="">
                                <div class="text">Note 11T Pro+</div>
                            </div>
                        </div>
                    </li>

                    <li><a href="#">电源&ensp;配件<span>></span></a>
                        <div class="column">
                            <div class="menu">
                                <img src="./img/小图标1.webp" alt="">
                                <div class="text">Note 11T Pro+</div>
                            </div>
                            <div class="menu">
                                <img src="./img/小图标1.webp" alt="">
                                <div class="text">Note 11T Pro+</div>
                            </div>
                        </div>
                    </li>

                    <li><a href="#">健康&ensp;儿童<span>></span></a>

                        <div class="column">
                            <div class="menu">
                                <img src="./img/小图标1.webp" alt="">
                                <div class="text">Note 11T Pro+</div>
                            </div>
                            <div class="menu">
                                <img src="./img/小图标1.webp" alt="">
                                <div class="text">Note 11T Pro+</div>
                            </div>

                        </div>

                    </li>

                    <li><a href="#">生活&ensp;箱包<span>></span></a>
                        <div class="column">
                            <div class="menu">
                                <img src="./img/路由器1.webp" alt="">
                                <div class="text">Note 11T Pro+</div>
                            </div>
                            <div class="menu">
                                <img src="./img/路由器1.webp" alt="">
                                <div class="text">Note 11T Pro+</div>
                            </div>
                        </div>
                    </li>
                    <li></li>
                    <li></li>
                    <li></li>
                </ul>
            </div>
            <!-- 轮播图 -->
            <div class="layui-carousel" id="test1">
                <div carousel-item class="banner_1">
                    <div>条目1</div>
                    <div>条目2</div>
                    <div>条目3</div>
                    <div>条目4</div>
                    <div>条目5</div>
                </div>
            </div>
        </div>
        <!-- 主要信息msg开始 -->
        <div class="msg">
            <div class="content">
                <!-- <img src="./img/images/小米-恢复的-恢复的-恢复的_02.jpg" alt=""> -->
            </div>
        </div>
        <!-- 热点开始 -->
        <div class="hot">
            <div class="content">
            </div>
        </div>
        <!-- 手机列表开始 -->
        <div class="phone">
            <div class="content">

            </div>
        </div>
</body>

<script src="./layui/layui.js"></script>
<script src="./js/common.js"></script>
<script src="//unpkg.com/layui@2.6.8/dist/layui.js"></script>
<script src="./js/XiaoMi.js"></script>
<script>

</script>

</html>